<!-- 提交结果页面 -->
<template>
	<view>
		<uni-card>
			<view class="rs-module">
				<uni-title type="h2" title="恭喜过关!" align="center" color="#00dd6b" v-if="exam.isPassed"></uni-title>
				<uni-title type="h2" title="成绩不合格!" align="center" color="#e03636" v-else></uni-title>


				<view class="rs-item rs-flex">
					<text class="rs-lable">题目总数：</text>
					<text class="rs-value">{{exam.totalQuestions}}题</text>
				</view>
				<view class="rs-item rs-flex">
					<text class="rs-lable">答对题数：</text>
					<text class="rs-value">
						<text style="color: #00dd6b;">{{exam.correctQuestions}}</text>题
					</text>
				</view>
				<view class="rs-item rs-flex">
					<text class="rs-lable">答错题数：</text>
					<text class="rs-value">
						<text style="color: #e03636;">{{exam.errorQuestions}}</text>题
					</text>
				</view>
				<view class="rs-item rs-flex">
					<text class="rs-lable">未答题数：</text>
					<text class="rs-value">
						<text style="color: #e03636;">{{exam.notQuestions}}</text>题
					</text>
				</view>
				<view class="rs-item rs-flex">
					<text class="rs-lable">答案解析：</text>
					<text class="rs-value link"
						@click="openAnswer">查看答案解析>></text>
				</view>
			</view>
		</uni-card>

	</view>
</template>
<script>
	import knowledge from '@/api/modules/knowledge'

 	export default {
		data() {
			return {
				exam : {},
			}
		},
		onLoad(options) {
			if('examId' in options) {
				knowledge.getExamById(options.examId).then(res=> {
					this.exam = res.data;
				})
			}
		},
		methods: {
			openAnswer() {
				uni.redirectTo({
					url: `/pages_duty/common/knowledge/skills/questions?examId=${this.exam.id}`
				})
			}
		}
	}

</script>

<style lang="scss" scoped>
	$margin: 24upx;
	.rs-flex {
		display: flex;
	}
	.rs-module {
		margin: $margin;
		margin-top: 12upx;
		background-color: #ffffff;
		border-radius: 16upx;
		padding:28upx 58upx;
		padding-bottom: 58upx;

		.rs-top {
			align-items: center;
			.sc-icon {
				color: #6bbb72;
				font-size: 88upx;
			}
			.sc-text {
				color: #00dd00;
				font-size: 36upx;
				font-weight: bold;
				padding: 0 28upx;
			}
		}

		.rs-item {
			align-items: center;
			.rs-lable {
				color: #636463;
			}
			.rs-value {
				padding: 0 10upx;
				line-height: 70upx;
				&-score {
					color: #e03636;
					font-size: 48upx;
				}
				&-unit {
					color: #343434;
					font-size: 32upx;
				}

				&.link {
					color: #0B56B1;
					&:active {
						opacity: 0.8;
					}
				}
			}

		}
	}
</style>
